var templat='<div id="home-content">'+
    '<div id="hedaerall">'+
    ' <div class="header-top">'+
    '<div class="header-top-content">'+
    '<div class="headr-top-left">'+
    '<span class="heder-top-login" >{{logintext}}<a href="javascript:;" style="color: #ffffff" v-if="!loginFlag" @click="goToLogin">请登录</a></span>'+
    '<span class="header-top-jiange" >|</span>'+
    '<span class="hader-top-register" ><a href="javascript:;" style="color: #FDEC8F" @click="loginOrOut">{{loginOrOut}}</a></span>'+
    '<span class="header-top-tel">'+
    '<img src="../images/header-tel@2x.png" alt="电话">'+
    '<span>客服热线：010-65889635</span></span>'+
    '</div>'+
'<ul class="headr-top-right">'+
'<li class="top-right-item-li"><span>帮助中心</span><span class="header-jiange">|</span></li>'+
'<li class="top-right-item-li"><span>保险攻略</span><span class="header-jiange">|</span></li>'+
'<li class="top-right-item-li" style="position: relative">'+
'<span id="webHttp">网址导航 <span class="header-jiange">|</span></span>'+
'<ul class="website-nav" id="website-nav-box">'+
'<li class="website-nav-item-li"><a href="" >首页的</a></li>'+
'<li class="website-nav-item-li"><a href="" >首页多发</a></li>'+
'</ul>'+
'</li>'+
'<li class="header-top-love top-right-item-li">'+
'<img src="../images/header-icon-heart-full@2x.png" alt="收藏">'+
'<span>收藏本站</span>'+
'</li>'+
'</ul>'+
'</div>'+
'</div>'+
' <div class="heder-bottom">'+
'<div class="header-bottom-content">'+
'<div class="hader-bottom-logo">'+
' <a href="javascript:;" class="logo-img-a">阳光三泰</a>'+
' </div>'+
'<div class="hader-bottom-nav">'+
'<ul class="heder-large-menu" id="largeMenu">'+
'<li class="heder-large-menu-item "><a href="javascript:;"  :class="[defaultClass,activeClass1]">首页</a></li>'+
'<li class="heder-large-menu-item"><a href="javascript:;" :class="[defaultClass,activeClass2]">产品中心</a></li>'+
'<li class="heder-large-menu-item"><a href="javascript:;" :class="[defaultClass,activeClass3]">保险公司</a></li>'+
' <li class="heder-large-menu-item " >'+
'<a href="javascript:;" :class="[defaultClass,activeClass4]">服务中心</a>'+
'<i class="icon-down"></i>'+
'<ul class="header-smal-menu" >'+
' <li class="smal-item-menu"><a href="javascript:;" class="smal-item-link">保单查询</a></li>'+
' <li class="smal-item-menu"><a href="javascript:;" class="smal-item-link">投保问题</a></li>'+
'<li class="smal-item-menu"><a href="javascript:;" class="smal-item-link">问题反馈</a></li>'+
'</ul>'+
'</li>'+
'<li class="heder-large-menu-item">'+
'<a href="javascript:;" :class="[defaultClass,activeClass5]">个人中心</a>'+
'<i class="icon-down"></i>'+
'<ul class="header-smal-menu" >'+
'<li class="smal-item-menu"><a href="javascript:;" class="smal-item-link">我的订单</a></li>'+
'<li class="smal-item-menu"><a href="javascript:;" class="smal-item-link">消息中心</a></li>'+
'<li class="smal-item-menu"><a href="javascript:;" class="smal-item-link">修改密码</a></li>'+
'</ul>'+
'</li>'+
'</ul>'+
'</div>'+
'<div class="hader-bottom-search">'+
'<div class="header-search-content">'+
'<input type="text" placeholder="请输入您想查询的保险产品" class="header-search-text">'+
'</div>'+
'<span class="header-search-button" @click="goToUrl()">搜索</span>'+

' </div>'+
' </div>'+
' </div>'+
' </div>'+

'</div>'

Vue.component('headerall', {
    template: templat,
    props: {
        activeIndex: {
            type: String,
            default: '1'
        }
    },
    data: function () {
        return {
            defaultClass:"menu-a-link",
            activeClass1:'heder-large-menu-active',
            activeClass2:'',
            activeClass3:'',
            activeClass4:'',
            activeClass5:'',
            activeClass6:'',
           loginFlag:true,//默认未登陆
            logintext:'hi，欢迎来到保险中介平台,',
            loginOrOut:'请登陆',
        }
    },
    created: function () {
        this.isLogin()
    },
    mounted: function () {

    },
    methods: {
        activeNav:function(index){
            this
        },
        isLogin:function(){
            //判断有没有登陆
            if(!this.loginFlag){
                this.logintext="hi，欢迎来到保险中介平台，"
                this.loginOrOut="请登陆"
            }else{
                this.logintext="李四你好，欢迎回来";
                this.loginOrOut="退出";
            }

        },
        goToLogin:function(){
          //根据不同的环境跳转到不同的环境的登陆页面
            alert('跳转登陆')
        },
        loginOrOut:function(){
            if(this.loginFlag){
                //没有登陆跳转到登陆注册页面
            }else{
                //已经登陆  退出
            }
        },
        goToUrl:function (val) {},
        handleSelect:function (val) {},

    }
})
